<template>
	<view>
		<view class="container pt15 plr30">
			<view class="ques mb20 p30">
				<view class="flex flex-align-start mb20">
					<view class="label">问</view>
					<view class="fs32 col10">{{question.info.question}}</view>
				</view>
				<view class="flex-box">	
					<view class="btn1 tr" v-if="question.info.state==1">未回复</view>
					<view class="btn1 tr" v-else>已回复</view>
				</view>
			</view>
			<view class="reply mb20" v-if="question.info.state==2">
				<view class="box1 p30 mb20">
					<view class="textarea">
						{{question.info.answer}}
					</view>
				</view>
				<view class="fs22 col89">{{question.info.createtime_text}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	const functions = require('../../../utils/functions.js');
export default {
	data() {
		return {
			id:0,
			question:''
		};
	},
	methods:{
		detail(){
			var that=this
			var id=that.id
			var json={
				id:id
			}
			functions.getAjaxList(that, '/api/xiluhouse/Question/question_detail', json, function (res) {
				that.question=res.data
			});
		}
	},
	onLoad(options) {
		this.id=options.id
		this.detail()
	}
};
</script>

<style lang="scss" scoped>
.ques {
	background: #ffffff;
	box-shadow: 0 4rpx 30rpx 0 rgba(184, 189, 202, 0.3);
	border-radius: 10rpx;
}
.ques .label {
	margin-top: 5rpx;
	margin-right: 10rpx;
	width: 40rpx;
	height: 40rpx;
	background: linear-gradient(180deg, #00c4ff 0%, #0091ff 100%);
	border-radius: 10rpx;
	font-size: 24rpx;
	color: #ffffff;
	line-height: 40rpx;
	text-align: center;
}
.ques .btn1 {
	width: 100%;
	font-size: 22rpx;
	color: #ff723b;
	line-height: 30rpx;
}
.box1 {
	width: 690rpx;
	background: #f6f7fa;
	border-radius: 10rpx;
}
.box1 .textarea {
	display: block;
	width: 100%;
	height: 100%;
	font-size: 28rpx;
	color: #333333;
	line-height: 40rpx;
}
</style>
